import * as THREE from 'three'
import { TextGeometry } from 'three/examples/jsm/geometries/TextGeometry.js';
import { CSS3DObject } from 'three/examples/jsm/renderers/CSS3DRenderer.js';
// css渲染器创建标签文字
class CreateTag {
    constructor(obj) {
        const div = document.createElement('div');
        div.innerHTML = obj.name;
        div.style.padding = '0';
        div.style.color = '#fff';
        div.style.fontSize = '12px';
        div.style.position = 'absolute';
        // div.style.border = '1px solid #fff'

        const mesh = new CSS3DObject(div);
        mesh.position.set(obj.centroid[0], obj.centroid[1], 0);
        mesh.scale.multiplyScalar(0.0028)
        div.style.pointerEvents = 'none';
        return mesh
    }

}
// 创建3D文字
class Create3DTag {
    constructor(obj, font) {
        const option = {
            font,
            size: 1,
            height: 0.2
        }
        let textGeo = new TextGeometry(obj.name, option);
        textGeo.center();
        let material = new THREE.MeshPhongMaterial({ color: '#ffffff', side: 20 });
        let textMesh = new THREE.Mesh(textGeo, material);
        textMesh.position.set(obj.centroid[0], obj.centroid[1], 0);
        textMesh.scale.multiplyScalar(0.018)
        return textMesh;
    }
}
// 创建标签文字
class CreateMarkTag {
    constructor(obj, font) {
        const option = {
            font,
            size: 1.5,
            height: 0.4
        }
        let textGeo = new TextGeometry(obj.name, option);
        textGeo.center();
        let material = new THREE.MeshBasicMaterial({ color: obj.color, side: 20 });
        let textMesh = new THREE.Mesh(textGeo, material);
        textMesh.position.set(obj.E, obj.N, 0.10);
        textMesh.rotateX(Math.PI / 2);
        textMesh.scale.multiplyScalar(0.018)
        return textMesh;
    }
}

export {
    CreateTag,
    Create3DTag,
    CreateMarkTag
}